<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增资源管理')" />
<!--    <th:block th:include="include :: datetimepicker-css" />-->
    <th:block th:include="include :: jasny-bootstrap-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-explorer-add">
            <div class="form-group">
                <label class="col-sm-3 control-label">资源名称：</label>
                <div class="col-sm-8">
                    <input name="resourceName" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">资源类型：</label>
                <div class="col-sm-8">
                    <select name="type" th:with="type=${@dict.getType('web_type')}" class="form-control m-b" required>
                        <option value="">请选择</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">所属课程：</label>
                <div class="col-sm-8">
                    <select name="courseId" id="courseName" class="form-control m-b" th:with="courses = ${@courseName.selectTbTotalCourseMainList(null)}"  required>
                        <option value="">请选择</option>
                        <option th:each="course : ${courses}" th:value="${course.id}" th:text="${course.courseName}"></option>
                    </select>
                    <!--<div class="input-group">
                        <input type="hidden" name="courseId" id="courseName">
                        <input class="form-control" id="suggest-demo-1" style="width:474px;"required>
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown">
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" role="menu">
                            </ul>
                        </div>
                    </div>-->
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">上传资源：</label>
                <div class="fileinput fileinput-new input-group" data-provides="fileinput">
                    <div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
                    <span class="input-group-addon btn btn-white btn-file"><span class="fileinput-new">选择文件</span><span class="fileinput-exists">更改</span><input name="file" type="file" id="file"></span>
                    <a href="#" class="input-group-addon btn btn-white fileinput-exists" data-dismiss="fileinput">清除</a>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <th:block th:include="include :: bootstrap-suggest-js" />
    <th:block th:include="include :: bootstrap-typeahead-js" />

    <th:block th:include="include :: jasny-bootstrap-js" />

    <script type="text/javascript">
        var prefix = ctx + "system/explorer";

        $("#form-explorer-add").validate({
            focusCleanup: true
        });

        var testBsSuggest = $("#suggest-demo-1").bsSuggest({
            url: ctx + "website/totalcourse/searchSelect",
            effectiveFields: ["courseName"],
            effectiveFieldsAlias:{courseName: "课程名称"},
            showBtn: false,
            idField: "id",
            keyField: "courseName",
        }).on('onSetSelectValue', function (e, keyword) {
            $("#courseName").val(keyword.id);
        });

        function submitHandler() {
            if ($.validate.form()) {
                //$.operate.save(prefix + "/add", $('#form-explorer-add').serialize());
                $.modal.confirm("确认要保存吗?", function() {
                    var form = new FormData(document.getElementById("form-explorer-add"));
                    $.ajax({
                        url:prefix+"/add",
                        type:"post",
                        data:form,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success:function(data){
                            if(data.code==500){
                                $.modal.msgError(data.msg)
                            }
                            if(data.code==0){
                                $.modal.msgSuccess(data.msg)
                                var int=self.setInterval(function(){  // 这个方法是说在延迟两秒后执行大括号里的方法
                                    $.modal.reload();
                                },1000) //这里2000代表两秒

                            }
                        }
                    });

                });
            }
        }
    </script>
</body>
</html>